<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
    <head>
        <title>AMBER: Anonymous Messages Board - E/R</title>

        <meta http-equiv="content-type" content="text/html; charset=utf-8" />
        
<!-- scripts we use  -->
    <!-- <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> -->
    <script type="text/javascript" src="./js/jquery.min.js"></script>
    <script type="text/javascript" src="./js/jquery-ui.min.js"></script>
    <script type="text/javascript" src="./js/jquery-ui-timepicker-addon.js"></script>
    <script type="text/javascript" src="./js/amber-process.js"></script>
<!--     
<script type="text/javascript"  src="https://getfirebug.com/firebug-lite.js">
{ overrideConsole: false, startInNewWindow: true, startOpened: true, enableTrace: true}
</script>
 -->

<!-- stylesheets  -->
    <link rel="stylesheet" href="./css/jquery-ui.css" type="text/css" />
    <link rel="stylesheet" href="./css/jquery-ui-timepicker-addon.css" type="text/css" />

    <link rel="stylesheet" href="./css/new.css" type="text/css" />
<!--
    <link rel="stylesheet" href="./css/default.css" type="text/css" />
    <link rel="stylesheet" href="./css/bar_user.css" type="text/css" />
 -->    
    <link rel="icon" type="image/png" href="./favicon.png" />
</head>

<body>
        <div id="wrapper">
           <div id="header">
               <h1>Anonymous Messages Board - E/R</h1>
               
               <form id="f_search" action="" method="post">
                   
                   <input id="uid_input" placeholder="Search message by id..." type="text" size="32"/>
          <!--
               <div id="recaptcha_div"></div>
          -->
                   <button id="btn_search" type="submit">Search</button>
                   <span id="f_search_info" class="status-info" title="Click to dismiss"></span>
                   <button id="btn_create" type="button">Create</button>
               </form>
            <div id="bar_user">
                <span id="bar_user_name">anonymous</span> | <a class="action login">log in</a>
            </div>
            </div>
            <div id="content"></div>
<!--  -->

            
<!--  -->
            <div class="push"></div>
        </div>
        <div id="footer">
        <p>Comments and public postings are in public domain. Creators are responsible for their publication. <a href="/feedback/">Feedback</a></p>
        </div>
        <div id="system" style="display: none;">
<!--  -->        
            <div id="edit_notice" title="Your edit was successfull">
                <p>Please, store  given below data to be able to edit/share/etc your message.</p>
                <div><span class="label">Message id:</span><span id='notice_id'></span></div>
                <div><span class="label">Expire on:</span><span id='notice_expire'></span></div>
                <div><span class="label">Worldkey:</span><span id='notice_worldkey'></span></div>
                <div><span class="label">Secret:</span><span id='notice_secret'></span></div>
                <p class="ref_faq">For more read <a target="_blank" href="#FAQ">FAQ</a></p>                
            </div>
<!--  -->        
	        <div class="envelope" id="">
                <div class="title">
	               <a class="self_id" href="" title="This message id"></a>
                  <span class="msg_role"></span> <a class="parent_id" href="" title="Parent message"></a>
                   <span class="created date" title="Click to view expiration date">created on: <span class="datetime"></span></span>
                   <span class="expire date" title="Click to view creation date">expire on: <span class="datetime"></span></span>
                </div>
                <div class="body">
                    
                    <div class="message"></div>
	                <div class="msg_bar">
                        <span>by <i class="nickname"></i></span>
                           [
                           <a class="reply action">reply</a> |
                           <a class="edit action">edit</a> 
                           ]
                    </div>
                </div>
                <a class="zipper" title="Toggle responses on/off"></a> [???]
                <span class="status-info" title="Click to dismiss"></span>
	            <div class="responses"></div>
	        </div>
<!--  --> 
            <div id="edit" ">
                <form id="f_edit">
                    <div class="fe_opt">
                        <label for="fe_expire_selector">Expire:</label>
                        <select id="fe_expire_selector">
                           <option value="v_not_set" disabled="disabled" selected="selected">...</option>
                           <option value="v_1_hour">in 1 hour</option>
                           <option value="v_1_day">in 1 day</option>
                           <option value="v_1_week">in 1 week</option>
                           <option value="v_1_month">in 1 month</option>
                           <option value="v_1_year">in 1 year</option>
                           <option disabled="disabled">----------------</option>
                           <option value="v_as_defined">as defined</option>
                        </select>
                        <input id="fe_expire"  class="fe_value" style="display: none" size="16"/>
                    </div>
        <!--              
                    <div class="fe_opt">
                        <label for="fe_nickname">Nickname:</label>
                        <input id="fe_nickname" class="fe_value" maxlength="64"/>
                    </div>
                    
                    <div class="fe_opt">
                        <label for="fe_superkey">Superkey:</label>
                        <input id="fe_superkey" class="fe_value key"/>
                    </div>
        -->            
                    <div class="fe_opt">
                        <div>
                           <label for="fe_message">Message:</label>
                           <span id="fe_message_cntr" title="Characters left to reach limit">123</span>
                        </div>
                        <textarea id='fe_message'  class="fe_value"></textarea>
                    </div>
                    
                    <a id="fe_optgrp_zipper" class="action"></a>
                    <div id="fe_optgrp">
                        <div class="fe_opt">
                            <input id="fe_secresp" type="checkbox"  class="fe_value"/>
                            <label for="fe_secresp" class="chkbox"> limit responses</label>
                            <div>
                                <label for="fe_worldkey">Worldkey:</label>
                                <input id="fe_worldkey" class="fe_value key"/>
                            </div>
                        </div>
                       
                        <div class="fe_opt">
                            <input id="fe_secstorage" type="checkbox"  class="fe_value"/>
                            <label for="fe_secstorage" class="chkbox"> encrypt message</label>
                            <div>
                                <label for="fe_secret">Secret:</label>
                                <input id="fe_secret" class="fe_value" size="25em"/>
                            </div>
                        </div>
                    </div>
                    <button id="fe_submit" type="submit">Save</button>
                    <span id="f_edit_info" class="status-info" title="Click to dismiss"></span>
                </form>
            </div>
<!--  -->        
        </div>
</body>
</html>